<script type="text/javascript" src="jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="jquery.rolling.js"></script>
<link rel="stylesheet" href="style.css" type="text/css">
<script>
	function containsCharsOnly(input, chars) {
	    for (var inx = 0; inx < input.length; inx++) {
	       if (chars.indexOf(input.charAt(inx)) == -1) {
	           return false;
	       }
	    }
	    return true;
	}
	
	function isNumber(input) {
	    var chars = "0123456789";
	    if (!containsCharsOnly(input, chars)) {
			alert("Please enter number only");
			return false;
	    }
	    return true;
	}
	
	function isWithinRange(input, min, max) {
		if (!isNumber(input)) {
			return false;
		}
		
		var intValue = parseInt(input, 10);
		if (min <= intValue &&  intValue <= max) {
			return true;
		} else {
			alert("Please enter " + min + " ~ " + max + ".");
			return false;
		}	
	}

	function apply(rollingId) {
		var rollingDiv = $("#" + rollingId);
		rollingDiv.setRollingTime($("input[type='text'][name='rollingTime']").val());
		rollingDiv.setViewingTime($("input[type='text'][name='viewingTime']").val());		
		var rollingAnimationFrame = $("input[type='text'][name='rollingAnimationFrame']").val();
		
		if (!isWithinRange(rollingAnimationFrame, 1, 100)) {		
			return;
		}	
				
		rollingDiv.setRollingAnimationFrameNext(rollingAnimationFrame);		
	}
		
	function rollingStop(rollingId) {
		var button = $("input[type='button'][name='controler']");
		if (button.val() == "stop") {
			$("#" + rollingId).stopRolling();
			button.val("resume");
		} else if (button.val() == "resume") {
			$("#" + rollingId).resumeRolling();
			button.val("stop");
		}
	}
	
	function reverse(rollingId) {
		$("#" + rollingId).reverseRolling();
	}
	
$(function() {
	eval($('#code').text());
});	
</script>
<body>
<h2>Large Image Rolling</h2>
<div id="rolling"></div><hr>
<h2>Script</h2>
<xmp id='code'>
		var rollingDiv = $("#rolling");
		rollingDiv.rolling("right", 800, 600);
		rollingDiv.addRollingItem("<img src='http://songsungkyun.cafe24.com/take/tnCASBSIB1.jpg'/>");
		rollingDiv.addRollingItem("<img src='http://songsungkyun.cafe24.com/take/54360865.jpg'/>");
		rollingDiv.addRollingItem("<img src='http://songsungkyun.cafe24.com/take/54499232.jpg'/>");
		rollingDiv.addRollingItem("<img src='http://songsungkyun.cafe24.com/take/75584053.jpg'/>");
		rollingDiv.addRollingItem("<img src='http://songsungkyun.cafe24.com/take/75726777.jpg'/>");
		rollingDiv.addRollingItem("<img src='http://songsungkyun.cafe24.com/take/089_law_and_order.jpg'/>");
		rollingDiv.addRollingItem("<img src='http://songsungkyun.cafe24.com/take/65077129.jpg'/>");
		rollingDiv.addRollingItem("<img src='http://songsungkyun.cafe24.com/take/66547382.jpg'/>");
		rollingDiv.addRollingItem("<img src='http://songsungkyun.cafe24.com/take/69437128.jpg'/>");
		rollingDiv.addRollingItem("<img src='http://songsungkyun.cafe24.com/take/74100619.jpg'/>");
		rollingDiv.addRollingItem("<img src='http://songsungkyun.cafe24.com/take/1338909229420d0bdf0c38b.jpg'/>");
		rollingDiv.addRollingItem("<img src='http://songsungkyun.cafe24.com/take/Image-2280-2671-jquery.gif'/>");
		rollingDiv.startRolling(50, 1000, 10);
</xmp>
</body>